<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="" name="选择表单">
        <p>
            <label for="音乐类型列表">
                选择一些音乐类型, 然后点击下方的按钮:
            </label>
            <select id="音乐类型列表"
                    name="音乐类型列表"
                    multiple="multiple"
            >
                <option selected="selected">R&B</option>
                <option>爵士</option>
                <option>布鲁斯</option>
                <option>新纪元</option>
                <option>古典</option>
                <option>歌剧</option>
            </select>
        </p>
        <p>
            <input type="button" id="按钮" value="选择了多少个选项?">
        </p>
    </form>
</body>
<script>
    function 计算数量(已选对象) {
        let 已选数量 = 0;
        for(let i = 0; i < 已选对象.options.length; i++) {
            if (已选对象.options[i].selected) {
                已选数量++;
            }
        }
        return 已选数量;
    }
    let 按钮 = document.getElementById('按钮');
    按钮.addEventListener(
        'click',
        function () {
            alert(
                '选择选项的数量是: ' + 计算数量(document.选择表单.音乐类型列表)
            )
        }
    )
</script>
</html>